<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/1.css') }}">
    <style>
        .center {
    background-image: url(../static/imgs/sp.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    min-height: 900px;
}
    </style>
</head>
<body>
<div class="head">
    <ul class="nav nav-pills">
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/index/">首页</a>
        </li>
        <li class="nav-item">
            <a class="nav-link active" href="#">商品</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/sell/">我也要卖</a>
        </li>
        <li class="nav-item">
            <a class="nav-link" href="http://127.0.0.1:5000/buyAdmin/">我的购买</a>
        </li>
        {% if user %}
            <li class="nav-item">
                <a class="nav-link" href="http://127.0.0.1:5000/admin/">欢迎您：{{ user.name }}，剩余余额：{{ user.balance }}</a>
            </li>
            <li class="nav-item">
                <a class="nav-link" href="http://127.0.0.1:5000/logout/">注销</a>
            </li>
        {% else %}
            <li class="nav-item">
                <a class="nav-link" href="http://127.0.0.1:5000/login/">登录</a>
            </li>
        {% endif %}
    </ul>
</div>
<div class="center">
   {% for good in goods %}
   	   <div class="center-item">
        <div class="card" style="width: 18rem;">
            <img src="{{good.img}}" class="card-img-top" alt="...">
            <div class="card-body">
                <h5 class="card-title">{{ good.g_name}}</h5>
                <p class="card-text">
                    {{good.describe}}
                </p>
                <a href="#" class="btn btn-primary" aid="{{ good.g_id }}">{{ good.price }}¥ 购买</a>
            </div>

        </div>
    </div>
   {% endfor %}


</div>
<div class="btm">
  <ul class="pagination justify-content-center">
    {% for i in range(goods.pages) %}
    	<li class="page-item">
            <a class="page-link" href="/sp/?page={{ i + 1 }}">{{ i + 1 }}</a>
        </li>
    {% endfor %}

  </ul>
</div>
</body>
<script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<script>
    $(function () {
        $('.card-body a').click(function () {
            var thar = $(this);
            var g_id = thar.attr('aid');

            var gm = event.srcElement.outerText
            console.log(event.srcElement.outerText)
            if (event.srcElement.outerText == gm) {
                if (window.confirm("您确定购买吗？")) {
                    $.post('/buy/', {'g_id': g_id}, function (data) {
                        console.log(g_id)
                        console.log(data.msg)
                        if (data.code==200){
                            location.reload()
                        }else{
                            alert(data.msg)
                        }
                    })

                }

            }
        })

    });
</script>
</html>